<template>
	<view class="app-container">
		<view class="header" :style="message.wxavatar ? 'padding: 40rpx 20rpx 235rpx;' : 'padding: 100rpx 20rpx 40rpx;'">
			<view class="left" @click="istrue = true">
				<view class="avatar">
					<image
						:src="message.wxavatar ? message.wxavatar : 'https://v6.site.niucloud.com/static/resource/images/default_headimg.png'"
						mode=""></image>
				</view>
				<view v-if="!message.wxavatar" class="basic-info">
					<view class="nickname">登录/注册</view>
					<view class="member">点击登录</view>
				</view>
				<view v-else class="basic-info">
					<view class="nickname">{{message.nickname}}</view>
					<view class="member">标准会员</view>
				</view>
			</view>
			<uv-icon :name="message.wxavatar ? 'lock-open' :'setting'" size='22'
				@click="message.wxavatar ?  logout() : ''"></uv-icon>
		</view>
		<view v-if="message.wxavatar" class="balance-box">
			<view class="open-member">
				<view class="text">开通可享更多权益</view>
				<view class="btn">立即开通</view>
			</view>
			<view class="grid">
				<view class="content">
					<view class="value">--</view>
					<view class="label">余额</view>
				</view>
				<view class="content">
					<view class="value">--</view>
					<view class="label">积分</view>
				</view>
				<view class="content">
					<view class="value">--</view>
					<view class="label">优惠券</view>
				</view>
			</view>
			<view class="btns">
				<view class="recharge-btn">余额充值</view>
				<view class="service-btn">专属顾问</view>
			</view>
		</view>
		<view class="box" v-if="message.wxavatar">
			<view class="grid">
				<view style="text-align: center;">
					<view>
						25张
					</view>
					<view class="label">优惠券</view>
				</view>
			</view>
		</view>
		<view class="box" v-if="message.wxavatar">
			<view class="grid">
				<view style="text-align: center;" v-for="(item,index) in myOrder"
					@click="toSkip(`/pages/orderList/orderList?type=${index}`)" :key="index">
					<image :src="item.icon" mode=""></image>
					<view class="label">{{item.label}}</view>
				</view>
			</view>
		</view>
		<view class="uv-swipe">
			<uv-swiper height="80" v-if="image?.length" :list="image" indicator indicatorMode="dot" circular></uv-swiper>
		</view>
		<view class="box">
			<view class="title" style="margin-bottom: 40rpx;font-size: 15px;">功能推荐</view>
			<view class="grid" style="grid-template-columns: repeat(4, minmax(0, 1fr));">
				<view style="text-align: center;" v-for="(item,index) in myTools" :key="index" @click="toSkip(item.skipPath)">
					<image :src="item.icon" mode=""></image>
					<view class="label">{{item.label}}</view>
				</view>
			</view>
		</view>
		<view class="shop">
			<view class="guess">
				———— 你可能想买 ————
			</view>
			<view class="goodslist">
				<view class="list" v-for="val in 6" :key="val" @click="tiaozhuan()">
					<image src="https://gd-hbimg.huaban.com/e86b6d1cb6be2b1a8430a82c63208bba2aa6cdafc39e2-hVFO5r_fw658webp"
						mode="aspectFill"></image>
					<view class="container">
						<view class="one-omit">
							测试商品
						</view>
						<view class="price-num">
							<view class="price">
								<text class="min">￥</text>
								<text class="max">157</text>
								<text class="min">.00</text>
							</view>
							<view class="discount">
								￥88.00
							</view>
						</view>
						<view class="action">
							<view class="discount">
								已售4件
							</view>
							<view class="btn-calculate">
								<text>购买</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
	<loginVue v-model="istrue" @change="getmessage()"></loginVue>
</template>

<script>
	import {
		GetPost
	} from '../../api/user.js';
	import loginVue from '../../components/login.vue'
	export default {
		data() {
			return {
				message: {},
				istrue: false,
				image: ['https://gd-hbimg.huaban.com/6a2af0a2b17da822ddadb87e9330b3988a7054b8681da-AyKWTS_fw658webp',
					'https://gd-hbimg.huaban.com/1154c597eccf64151bc6f4c6ac7cd6e5c5bc8fd06cc21-o6ssiP_fw658webp',
					'https://gd-hbimg.huaban.com/small/407d5e1b6feb4f20879936831aa57aba53ef852419e2a5-SQnJ33_fw240webp',
					'https://gd-hbimg.huaban.com/ab5bfe7be7ae62af744fe503425b728b46068e7f5987b-53Kr6t_fw240webp',
					'https://gd-hbimg.huaban.com/3c5969d8056956dd8f73238a7f8d3c64893405d91e626-P886vU_fw658webp',
					'https://gd-hbimg.huaban.com/small/91b649d04a5ef6504f29e4b9b0b9af6b005177bbe8c4e-t0FZuY_fw240webp',
					'https://gd-hbimg.huaban.com/cb46f32b6c71d063b81086edbf173fe76cf44d0893ea6-hD6yZb_fw240webp',
					'https://gd-hbimg.huaban.com/b64b196f942284ff4fcc31c7b5b380665ebfa7321f2503-Fq6xu7_fw240webp',
					'https://gd-hbimg.huaban.com/a99889190a94e35324441713a67833737d5706082c1434-rF3ooo_fw658webp'
				],
				myOrder: [{
					icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/order1.png',
					label: '待付款'
				}, {
					icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/order2.png',
					label: '待发货'
				}, {
					icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/order3.png',
					label: '待收货'
				}, {
					icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/order4.png',
					label: '待评价'
				}, {
					icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/order5.png',
					label: '售后/退款'
				}],
				myTools: [{
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_address.png',
						skipPath: '/pages/AddressList/AddressList',
						label: '地址管理'
					},
					{
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_promote.png',
						label: '分销中心',
						skipPath: '/pages/center/distribution/distribution'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_point_change.png',
						label: '积分兑换'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_verify_index.png',
						label: '核销台'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_giftcard.png',
						label: '礼品卡'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_my_level.png',
						label: '我的等级'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_collect.png',
						label: '我的收藏'
					}, {
						icon: 'https://v6.site.niucloud.com/addon/shop/diy/member/style1/nav_service.png',
						label: '联系客服'
					}
				]
			}
		},
		components: ({
			loginVue
		}),
		onLoad() {
			this.getmessage()
		},
		methods: {
			toSkip(path) {
				if (path) {
					uni.navigateTo({
						url: path
					})
				}
			},
			async getmessage() {
				let {
					data
				} = await GetPost('member/read')
				this.message = data
			},
			logout() {
				uni.showModal({
					title: "确定要退出登录吗",
					success: (res) => {
						if (res.confirm) {
							uni.clearStorageSync()
							this.message = {}
							uni.showToast({
								title: '退出登录成功'
							})
						}
					}
				})
			},
			tiaozhuan() {
				uni.navigateTo({
					url: '/pages/goodsDetails/goodsDetails'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'style.scss';
</style>